<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<%@ include file="../taglib.jsp"%>

<script>
	$(window).load(function() {
		$('.flexslider').flexslider();
	});

	$('.flexslider').flexslider({
		animation : 'slide',
		controlNav : false
	});
</script>


<div id="feature" role="feature" class="container-fluid">
	<div id="feature-inner" role="feature-inner" class="row-fluid"
		style="width: 65%; height: 40%; margin: 0 auto;">
		<div class="span12">
			<div class="flexslider">
				<ul class="slides">
					<li><a href='#'><img
							src='<spring:message code="domain"/>/img/carousel/08.jpg' /></a></li>
					<li><a href='#'><img
							src='<spring:message code="domain"/>/img/carousel/05.jpg' /></a></li>
					<li><a href='#'><img
							src='<spring:message code="domain"/>/img/carousel/11.jpg' /></a></li>
					<li><a href='#'><img
							src='<spring:message code="domain"/>/img/carousel/09.jpg' /></a></li>
				</ul>
			</div>
		</div>
	</div>
	<!--end Feature-inner-->
</div>
<!--end Feature-->

<div ng-controller="SearchCtrl">

	<div id="scrollTo"></div>

	<div align="center" style="margin-top: 20px; margin-bottom: 50px">
		<div class="row-fluid form-inline searchBox">
			<input id="searchContent" type="text" class="input-large"
				placeholder="Key words" style="width: 665px; height: 30px"
				ng-model="searchRq.content" />
			<button class='btn searchBtn' ng-click="search()">
				<i class="icon-search"></i>
			</button>
			<!-- <input type="button" ng-click="search()" value="Search" class="btn" /> -->
			<input type="button" ng-click="advSearch()" value="Advance search"
				class="btn advSearchBtn" />

			<div class="advSearchBox" style="display: none">
				Price lower than: <input id="searchPrice" type="text"
					class="input-large" placeholder="Input Price"
					onkeypress='validateDouble(event, this)' ng-model="searchRq.price" />
				Manufacturer: <input id="textManufacturer" type="text"
					class="input-large" placeholder="Manufacturer" />
			</div>

		</div>
	</div>
	<div class="container-fluid" align="center" id="resultArea">
		<div class="pagination">
			<ul>
				<li ng-repeat="p in pages"><a href="" ng-click="changePage(p)">{{p}}</a></li>
			</ul>
		</div>
		<div class="row-fluid"
			style="max-width: 1055px !important; margin: 0 auto;">
			<ul class="thumbnails products" style="text-align: center;">
				<li class="span2" ng-repeat="result in results | startFrom:currentPage*pageSize | limitTo:pageSize"><a
					href="<spring:message code="domain"/>/#/product/{{result.id}}">
						<img style="height: 140px" ng-src="{{result.imageUrl}}">
				</a>
					<div class="product-meta">
						<h2>
							<a href="<spring:message code="domain"/>/#/product/{{result.id}}">
								{{result.name}} </a>
						</h2>
						<p>There are {{result.storeCount}} store(s) sale this product</p>
						<div class="row-fluid">
							Lowest price: <span class="price">{{result.minPrice}}</span>
						</div>
						<div class="row-fluid">
							<a href="<spring:message code="domain"/>/#/product/{{result.id}}">
								View detail </a>
						</div>
					</div></li>
			</ul>
		</div>
		<div class="pagination">
			<ul>
				<li ng-repeat="p in pages"><a href="" ng-click="changePage(p)">{{p}}</a></li>
			</ul>
		</div>
	</div>
</div>